<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>快速排序演示</title>
    <link rel="stylesheet" href="styles.css">
    <link rel="stylesheet" href="quick-sort.css">
</head>
<body>
    <div class="container">
        <div class="header">
            <a href="index.html" class="back-button">← 返回首页</a>
            <h1>⚡ 快速排序 ⚡</h1>
        </div>
        
        <div class="game-controls">
            <button id="generateNew">生成新数字</button>
            <button id="startSort">开始排序</button>
            <button id="nextStep">下一步</button>
            <button id="reset">重置</button>
        </div>

        <div class="numbers-container" id="numbersContainer">
        </div>

        <div class="explanation">
            <h3>📝 说明：</h3>
            <p>快速排序通过选择基准值(pivot)将数组分成两部分，左边小于基准值，右边大于基准值！</p>
            <div id="currentStep">准备开始...</div>
        </div>
    </div>
    <script src="quick-sort.js"></script>
</body>
</html> 